<template>
    <div>
        <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>运单列表</el-breadcrumb-item>
        </el-breadcrumb><br>
        <!-- <el-button size="small" type="success" @click="port">导出为excel表格</el-button> -->
        <el-table
            :data="order_list"
            style="width: 100%">
                <el-table-column
                    prop="invoice"
                    label="发货单号"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="id"
                    label="设备ID"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="goods_type_name"
                    label="货物类型">
                </el-table-column>
                <el-table-column
                    prop="safe_temperature"
                    label="安全温度 (°C)"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="interval"
                    label="记录间隔"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="delayed"
                    label="延迟时间"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="create_time"
                    label="开始时间"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="end_time"
                    label="结束时间"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="order_state"
                    label="运单状态"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="temperature_record"
                    label="温度记录"
                    width="180">
                </el-table-column>
                
                <el-table-column
                    fixed="right"
                    label="操作"
                    width="100">
                
                    <template slot-scope="scope">
                        <el-button @click="port(scope.row)" type="text" size="small">查看</el-button>
                    </template>
                </el-table-column>
            </el-table>
    </div>
</template>
<script>
import {get_order_list_get,get_temperature_get} from './axios_api/api.js'
export default {
    data() {
        return {
            order_list: [],
        }
    },
    mounted() {
        this.get_order_message_list()
    },
    methods: {
        get_order_message_list(){
            get_order_list_get().then(res => {
                console.log(res);
                this.order_list = res.order_list
            })
        },
        export2Excel(tableData){
            require.ensure([],()=>{
                const {export_json_to_excel } = require('../lib/Export2Excel.js')
                const tHeader = ['运单id','温度记录']   //自定义列名
                const filterVal = ['order_ID','temperature_new']   //对应自怼
                const list = tableData   //table数据
                const data = this.formatJson(filterVal,list);
                export_json_to_excel(tHeader,data,'列表excel');  //导出文件名称
            })
        },
        formatJson(filterVal,jsonData){
            console.info(jsonData)
            return jsonData.map(v => filterVal.map(j=> v[j]))
        },
        port(row){
            
            get_temperature_get({id:row.id}).then(res => {
                console.log(res)
                let tableData = res.temperature_list
                this.export2Excel(tableData)
            })
            
        },
    },

}
</script>

<style scoped>
    
</style>